<template>
  <!-- 专项治理类型选择 -->
  <a-select v-bind="$attrs" v-on="$listeners" :placeholder="placeholder" v-model="currentValue" allowClear>
    <a-icon v-if="fetching" style="color: #096dd9" slot="suffixIcon" type="loading" />
    <a-spin v-if="fetching" slot="notFoundContent" size="small" />
    <a-select-option v-for="i in list" :key="i.id" :value="i.id">
      <a-tooltip>
        <template slot="title">
          {{ i.name }}
        </template>
        {{ i.name }}
      </a-tooltip>
      </a-select-option>
  </a-select>
</template>
<script>
import { scoringType } from '@/api/quality/quality' // api

export default {
  name: 'SelectGovScoreClass',
  props: {
    // v-model绑定的数据
    value: {
      type: [Array, String, Object],
    },
    // placeholder
    placeholder: {
      type: String,
      default: function () {
        return '请选择'
      },
    },
    // 额外查询参数
    extraQuery: {
      type: Object,
      default() {
        return {
          statusCode:'1'
        }
      },
    },
  },
  data() {
    return {
      fetching: false,
      list: [],
    }
  },
  mounted() {
    this.getList()
  },
  methods: {
    getList() {
      this.fetching = true
      scoringType.getList(this.extraQuery)
        .then((res) => {
          this.fetching = false
          this.list = res.data || []
        })
        .catch(() => {
          this.fetching = false
        })
    },
  },
  computed: {
    // 转换绑定的选中数据，与v-model同步
    currentValue: {
      get: function () {
        return this.value
      },
      set: function (value) {
        this.$emit('input', value)
      },
    },
  },
}
</script>
